<template>
  <div id="uesrtext">
    <el-input placeholder="按 Ctrl + Enter 发送" v-model="content" type="textarea" :rows="7"
              @keydown.ctrl.enter.native="addMessage">
    </el-input>
    <el-button type="success" size="mini" class="tw-absolute tw-bottom-0 tw-right-0" @click="addMessage">发送
    </el-button>
  </div>
</template>

<script>
import {mapState} from 'vuex'

export default {
  name: 'uesrtext',
  data() {
    return {
      content: ''
    }
  },
  computed: mapState([
    'currentSession'
  ]),
  methods: {
    addMessage(e) {
      if (Object.keys(this.currentSession).length===0) {
        this.$message.info("不能发给自己，请选择别人聊天")
        return
      }
      let msgObj = new Object();
      msgObj.to = this.currentSession.username
      msgObj.content = this.content
      this.$store.state.stomp.send('/ws/chat', {}, JSON.stringify(msgObj))
      this.$store.commit('addMessage', msgObj);
      this.content = '';
    }
  }
}
</script>

<style lang="scss" scoped>
#uesrtext {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 30%;
  border-top: solid 1px #DDD;
}
</style>
